Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Provide more intuitive calendar controls #152

Merged
merged 1 commit into from
Apr 18, 2024
Merged

Provide more intuitive calendar controls #152

merged 1 commit into from
Apr 18, 2024

Conversation

nilmerg
Copy link
Member

@nilmerg nilmerg commented Dec 21, 2023

resolves #113

@nilmerg nilmerg added enhancement New feature or improvement area/controls Affects the controls labels Dec 21, 2023
@nilmerg nilmerg added this to the Preview #1 milestone Dec 21, 2023
@nilmerg nilmerg self-assigned this Dec 21, 2023
@cla-bot cla-bot bot added the cla/signed CLA is signed by all contributors of a PR label Dec 21, 2023
@nilmerg nilmerg force-pushed the more-intuitive-calendar-controls branch from 823d926 to 97c17f1 Compare December 21, 2023 10:57
@nilmerg
Copy link
Member Author

nilmerg commented Dec 21, 2023

I've deviated from the mockups in the issue somewhat by intention:

  • The previous and next buttons are only two. I see no practical reason why someone wants to quickly cycle through entire years.
  • The previous and next arrows don't use the double arrow icon, as we're already using the single arrow icon in Icinga DB Web.
  • The week controls are further separated. Just a week no. isn't sufficient. And listing 52-53 weeks in a single dropdown isn't practical as well. So I've split this up into a month selection and a week selection which only shows weeks in the given month.
  • There wasn't a mockup for the day view. It's using the date input still, as it's available in every browser. Splitting that thing up into separate inputs would be even more complicated than the week controls, so I kept that for simplicity reasons.

@raviks789
Copy link
Contributor

raviks789 commented Dec 21, 2023 •
edited
Loading

Since only previous and next 5 years and the current year is available for selection in the month and week mode. If you select the last month or last calendar week in the year 2028 (current year + 5 years) and click next, the calendar grid shows the 1st month or calendar week of year 2029. But the year drop down changes to 2018 (first option in the dropdown). This is also true in case of first month or calendar week of 2018 and click previous. Here the year dropdown still shows 2018. But the calendar grid shows the last month or calendar week of 2017.

Also once you have moved to the year not displayed in the year dropdown, changing the month throws below error.

Start is not a monday or not midnight
#0 /usr/share/icingaweb2-modules/notifications/library/Notifications/Widget/Calendar/BaseGrid.php(50): Icinga\Module\Notifications\Widget\Calendar\WeekGrid->setGridStart(Object(DateTime))
#1 /usr/share/icingaweb2-modules/notifications/library/Notifications/Widget/Calendar.php(126): Icinga\Module\Notifications\Widget\Calendar\BaseGrid->__construct(Object(Icinga\Module\Notifications\Widget\Calendar), Object(DateTime))
#2 /usr/share/icingaweb2-modules/notifications/library/Notifications/Widget/Calendar.php(204): Icinga\Module\Notifications\Widget\Calendar->getGrid()
#3 /usr/local/src/ipl-html/src/HtmlDocument.php(344): Icinga\Module\Notifications\Widget\Calendar->assemble()
#4 /usr/local/src/ipl-html/src/HtmlDocument.php(566): ipl\Html\HtmlDocument->ensureAssembled()
#5 /usr/local/src/ipl-html/src/HtmlDocument.php(390): ipl\Html\HtmlDocument->render()
#6 /usr/local/src/ipl-html/src/BaseHtmlElement.php(297): ipl\Html\HtmlDocument->renderUnwrapped()
#7 /usr/local/src/ipl-html/src/BaseHtmlElement.php(365): ipl\Html\BaseHtmlElement->renderContent()
#8 /usr/local/src/ipl-html/src/HtmlDocument.php(568): ipl\Html\BaseHtmlElement->renderUnwrapped()
#9 /usr/local/src/ipl-html/src/HtmlDocument.php(390): ipl\Html\HtmlDocument->render()
#10 /usr/local/src/ipl-html/src/BaseHtmlElement.php(297): ipl\Html\HtmlDocument->renderUnwrapped()
#11 /usr/local/src/ipl-html/src/BaseHtmlElement.php(365): ipl\Html\BaseHtmlElement->renderContent()
#12 /usr/local/src/ipl-html/src/HtmlDocument.php(568): ipl\Html\BaseHtmlElement->renderUnwrapped()
#13 /usr/local/src/ipl-html/src/HtmlDocument.php(390): ipl\Html\HtmlDocument->render()
#14 /usr/local/src/ipl-html/src/BaseHtmlElement.php(297): ipl\Html\HtmlDocument->renderUnwrapped()
#15 /usr/local/src/ipl-html/src/BaseHtmlElement.php(365): ipl\Html\BaseHtmlElement->renderContent()
#16 /usr/local/src/ipl-html/src/HtmlDocument.php(568): ipl\Html\BaseHtmlElement->renderUnwrapped()
#17 /usr/local/src/ipl-html/src/HtmlDocument.php(390): ipl\Html\HtmlDocument->render()
#18 /usr/local/src/ipl-html/src/HtmlDocument.php(568): ipl\Html\HtmlDocument->renderUnwrapped()
#19 /usr/local/src/ipl-web/src/Compat/ViewRenderer.php(56): ipl\Html\HtmlDocument->render()
#20 /usr/share/icinga-php/vendor/vendor/shardj/zf1-future/library/Zend/Controller/Action/Helper/ViewRenderer.php(970): ipl\Web\Compat\ViewRenderer->render()
#21 /usr/share/icinga-php/vendor/vendor/shardj/zf1-future/library/Zend/Controller/Action/HelperBroker.php(277): Zend_Controller_Action_Helper_ViewRenderer->postDispatch()
#22 /usr/share/icinga-php/vendor/vendor/shardj/zf1-future/library/Zend/Controller/Action.php(527): Zend_Controller_Action_HelperBroker->notifyPostDispatch()
#23 /icingaweb2/library/Icinga/Web/Controller/Dispatcher.php(76): Zend_Controller_Action->dispatch(String)
#24 /usr/share/icinga-php/vendor/vendor/shardj/zf1-future/library/Zend/Controller/Front.php(954): Icinga\Web\Controller\Dispatcher->dispatch(Object(Icinga\Web\Request), Object(Icinga\Web\Response))
#25 /icingaweb2/library/Icinga/Application/Web.php(294): Zend_Controller_Front->dispatch(Object(Icinga\Web\Request), Object(Icinga\Web\Response))
#26 /icingaweb2/library/Icinga/Application/webrouter.php(105): Icinga\Application\Web->dispatch()
#27 /icingaweb2/public/index.php(4): require_once(String)
#28 {main}

@nilmerg nilmerg force-pushed the more-intuitive-calendar-controls branch from 97c17f1 to 59fe7b5 Compare December 21, 2023 14:53
@nilmerg nilmerg force-pushed the more-intuitive-calendar-controls branch from 59fe7b5 to 4018874 Compare April 12, 2024 13:24
@nilmerg
Copy link
Member Author

nilmerg commented Apr 15, 2024

New changes:

  • All dropdowns have previous/next buttons now.
  • The year dropdown now shows the previous 5 and next 5 years based on current selection, not on the current year.
  • The year and week dropdowns always allow to switch to the current year/week.
  • The viewmode switcher has been moved to the very right. This is to ensure a fixed location. It also fits with what the redesign (Redesigned Scheduler UI #177) probably requires.

@nilmerg nilmerg requested review from flourish86 and raviks789 and removed request for flourish86 and raviks789 April 15, 2024 08:38
raviks789
raviks789 approved these changes Apr 18, 2024
View reviewed changes
Copy link
Contributor

@raviks789 raviks789 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me.

@nilmerg nilmerg force-pushed the more-intuitive-calendar-controls branch from 9396e75 to 39ff2e7 Compare April 18, 2024 09:17
@nilmerg nilmerg removed the request for review from flourish86 April 18, 2024 09:18
@nilmerg nilmerg merged commit 0a3b06c into main Apr 18, 2024
22 checks passed
@nilmerg nilmerg deleted the more-intuitive-calendar-controls branch April 18, 2024 09:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@raviks789 raviks789 raviks789 approved these changes

Assignees

@nilmerg nilmerg

Labels
area/controls Affects the controls cla/signed CLA is signed by all contributors of a PR enhancement New feature or improvement
Projects
None yet
Milestone
Beta
Development

Successfully merging this pull request may close these issues.

More intuitive Date selectors.
2 participants
@nilmerg @raviks789